<%--
  Created by IntelliJ IDEA.
  User: kuibu
  Date: 16/2/17
  Time: 上午5:18
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0">
    <title>填写跬步邀请码</title>

    <link rel="icon" sizes="192x192" href="http://img.kuibutech.com/kbApp_fixedImage/favcion.jpg">
    <link rel="stylesheet" href="http://www.kuibutech.com/kuibuversion1/css/bootstrap.min.css">
    <script src="http://www.kuibutech.com/kuibuversion1/js/jquery-1.7.1.js"></script>
</head>

<script>
    $(document).ready(function () {
        check();
        $("#subBtn").bind("click", submitInvite);
    });

    function check() {
        var hasInputInviteCode = document.getElementById("hasInputInviteCode").value;
        if (hasInputInviteCode == "true") {
            $("#success").css("display", "inline");
            $("#inputInviteCode").css("display", "none");
        }
    }

    function submitInvite() {
        var inviteCode = document.getElementById("inviteCode").value;
        var userId = document.getElementById("userId").value;
        if (inviteCode == "") {
            alert("请输入邀请码再进行提交")
        } else {
            $.post("/kuibuversion1/share/submitInvite", {inviteCode: inviteCode, userId: userId}, function (data) {
                if (data.result == true) {
                    $("#success").css("display", "inline");
                    $("#inputInviteCode").css("display", "none");
                } else {
                    alert("提交出错了")

                }
            });
        }
    }

</script>

<body>
<div style="text-align: left;margin-top: 150px;">
    <div style="margin-left:30%;">
        <label>1. 属于我的邀请码: </label><br/>
        <label style="color: #ffd145;margin-left:5%;">${inviteCode}</label>
    </div>

    <div style="margin-left:30%;">
        <label>2. 我邀请成功的好友数为:</label><br/>
        <label style="color: #ffd145;margin-left:5%;">${invitedFriends}</label><br/>
        <label>3. 输入好友的邀请码:</label>
    </div>

    <div id="success" style="margin-left:30%;display: none">
        <img src="">
        <label>您已成功填写邀请码</label>
    </div>


    <div id="inputInviteCode" style="width: 50%;margin-left:25%;margin-top: 1.5em;">

        <form action="" method="post">
            <input type="text" name="invitecode" id="inviteCode" class="form-control" placeholder="输入邀请码"/>
            <input id="userId" hidden name="userId" value="${userId}">
            <input id="hasInputInviteCode" hidden value="${hasInputInviteCode}">
        </form>

        <button id="subBtn" type="submit" class="btn btn-primary"
                style="background:#ffd145;border: none;width: 100%;margin-top: 1em;">完成邀请
        </button>
    </div>
</div>
</body>
</html>